<template>
  <el-table :data="emp" style="width: 100%" border="true">

    <el-table-column
      prop="id"
      label="员工ID"
      align='center'
      >
    </el-table-column>

    <el-table-column
      prop="account"
      label="员工账号"
      align='center'
      >
    </el-table-column>

    <el-table-column
      prop="password"
      label="员工密码"
      align='center'
    >
    </el-table-column>

    <el-table-column
      prop="status"
      label="员工状态"
      align='center'
      >
    </el-table-column>

    <el-table-column
      prop="name"
      label="员工姓名"
      align='center'
      >
    </el-table-column>

    <el-table-column
      prop="gender"
      label="员工性别"
      align='center'
      >
    </el-table-column>

    <el-table-column
      prop="roleid"
      label="角色ID"
      align='center'
      >
    </el-table-column>


    <el-table-column label="操作" align='center'>
      <template slot-scope="scope">
        <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
          >编辑</el-button
        >
        <el-button
          size="mini"
          type="danger"
          @click="handleDelete(scope.$index, scope.row)"
          >删除</el-button
        >
      </template>
    </el-table-column>

  </el-table>
</template>

<script>

export default {
    created(){
        this.$axios.post(this.$server+'/api/emp/list',{})
        .then(response=>{
            let result = response.data;
            if(result.code==200){
                console.log("员工列表===============>",result.data);
                this.emp=result.data;
            }
        });
    },
    data() {
        return {
            emp:[],
        };
    },
    methods: {
        handleEdit(index, row) {
          console.log(index, row);
        },
        handleDelete(index, row) {
          console.log(index, row);
         // 二次确认删除
            this.$confirm('确定要删除吗？', '提示', {
                type: 'warning'
            })
                .then(() => {
                    this.$message.success('删除成功');
                    this.emp.splice(index, 1);
                })
                .catch(() => {});
          
        },

        del:function(emp){
          console.log("mor========>",emp);
            //表示先获取这个元素的下标，然后从这个下标开始计算，删除长度为1的元素
            this.emp.splice(this.emp.indexOf(emp),1);
        }
    },
};
</script>